<script type="text/javascript">

//variable to check how many googlemaps there are opened
var num_googlemaps = 0;

//variable to check how many picture windows have opened
var num_pictures = 0;

//variables used for checking if the dialogs are opened or not
var login_dialog = false;
var create_account_dialog = false;
var add_restaurant_dialog = false;
var browse_restaurants_dialog = false;

function init_window(_div){
	//add the close window button
	var _close = $('<img align="right" style="cursor: hand;" src="<?php echo base_url();?>application/views/images/close.png" />');
	$(_div).append(_close);
	$(_close).click(function () {
 		close_window(_div);
    });
	//display the name of the window
	$(_div).append("<div style='color: white; font-weight: bold;'>&nbsp&nbsp"+$(_div).attr("name")+"</div>");

	//add the draggable header
	var newDiv = $(document.createElement('div'));

	//add some style to the window
	//$(newDiv).css('background-color', '#f00');
	$(newDiv).css('width', _div.width()-24);
	$(newDiv).css('height', 20);
	$(newDiv).css('position', 'absolute');
	$(newDiv).css('left', 0);
	$(newDiv).css('top', 0);
	$(newDiv).css('cursor', 'move');
	//$(newDiv).css('background-image', 'url("<?php echo base_url();?>application/views/images/dialog-border.png")');
	//$(newDiv).css('background-repeat', 'repeat-x');
	//$(newDiv).css('border-radius', '10px');
	newDiv.appendTo(_div);

	//display the name of the window
	$(newDiv).append("<div style='color: white; font-weight: bold;'>&nbsp&nbsp"+$(_div).attr("name")+"</div>");
	
	//make it draggable
	$(_div).draggable({handle: newDiv});
}

function clear_window(_div){
	$(_div).empty();
	init_window(_div);
}

function change_window_name(_div, _window_header){
	$(_div).attr("name", _window_header);
}

function close_window(_div){
	$(_div).fadeOut(500).delay(500).queue(function() {
		$(this).remove();
	});
	
	if($(_div).attr("name") == "Login"){
		login_dialog = false;
	}
	if($(_div).attr("name") == "Create Account"){
		create_account_dialog = false;
	}
	if($(_div).attr("name") == "Add Restaurant"){
		add_restaurant_dialog = false;
	}
	if($(_div).attr("name") == "Browse Restaurants"){
		browse_restaurants_dialog = false;
	}
}

function spawn_window(_width, _height, _window_header){
	
}

function add_window(_width, _height, _window_header){
	var newDiv = $(document.createElement('div'));

	//add some style to the window
	$(newDiv).css('background-color', '#223');
	$(newDiv).css('width', _width);
	$(newDiv).css('height', _height);
	$(newDiv).css('position', 'absolute');
	$(newDiv).css('left', 0);
	$(newDiv).css('top', 0);
	$(newDiv).css('background-image', 'url("<?php echo base_url();?>application/views/images/dialog-border.png")');
	$(newDiv).css('background-repeat', 'repeat-x');
	$(newDiv).css('border-radius', '10px');
	$(newDiv).css('border', '3px solid #000');
	$(newDiv).css('overflow', 'auto');
	//$(newDiv).css('opacity', '5.5');
	//$(newDiv).css('filter', 'alpha(opacity=100)');/* For IE8 and earlier */
	//$(newDiv).css('margin', '0px');
	//$(newDiv).css('padding', '0 2 2 2px');

	//change name of the current div
	$(newDiv).attr("name", _window_header);

	init_window(newDiv);

	//append it to the body_page div
	newDiv.appendTo("#body_page");
	
	return newDiv;
}

function initialize_google_map(_address, _div){
	var newDiv = $(document.createElement('div'))
    .attr("class", 'gm');

	//add some style to the window
	$(newDiv).css('background-color', '#223');
	$(newDiv).css('width', _div.width()-10);
	$(newDiv).css('height', _div.height()-29);
	$(newDiv).css('position', 'absolute');
	$(newDiv).css('left', 5);
	$(newDiv).css('top', 24);

	//change name of the current div
	var _new_name = "googlemap"+num_googlemaps;
	$(newDiv).attr("name", _new_name);

	//append it to _div
	newDiv.appendTo(_div);

    var geocoder;
    var map;
      
    geocoder = new google.maps.Geocoder();
    var myOptions = {
    	zoom: 8,
    	mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	map = new google.maps.Map(document.getElementsByName(_new_name)[0], myOptions);
      
	var address = _address;
	geocoder.geocode( { 'address': address}, function(results, status) {
		if (status == google.maps.GeocoderStatus.OK) {
			map.setCenter(results[0].geometry.location);
			var marker = new google.maps.Marker({
				map: map,
				animation: google.maps.Animation.DROP,
				position: results[0].geometry.location
			});
		}
	});
      
    
    num_googlemaps++;
}

function flickr_url(_url){
	var picture_id = "img_flickr_"+num_pictures;
	var newDiv = $(document.createElement('div'));
	$(newDiv).append("<img id='"+picture_id+"' src='"+_url+"' />");
	var _w = $("#img_flickr_0").width();
	var _div = add_window(420,340,"Picture");
	$(newDiv).remove();
	$(_div).css("left", "32");
	$(_div).css("top", "32");
	$(_div).append("<img src='"+_url+"' />");
	//$(_div).css("width", $("#"+picture_id).width());
	//$(_div).css("height", $("#"+picture_id).height());
	num_pictures++;
}

function switch_bg(which){
	if(which == 'orange.jpg'){
		$("body").removeClass("bg1").addClass("bg0");
	}
	else if(which == 'fruit.jpg'){
		$("body").removeClass("bg0").addClass("bg1");
	}
}


$(document).ready(function () {
	//fulhax start
	//if this code isn't here galeryview won't work later for some unknown reason
	/*var my_window = add_window(500,500,"Restaurant Pictures");
	initialize_flickr(my_window);
	$(my_window).css('left', -5000);
	$(my_window).css('top', -5000);
	close_window(my_window);*/
	//fulhax end
	
	$('#menu_selector').hide();
	//console.log("test");
	$('#menu_selector').css('position', 'absolute');
	$('#menu_selector').css('left', 30);
	$('#menu_selector').css('top', 0);
	

	//$("div, p").disableSelection();
	document.onselectstart = function () { return false; }

	//login mouse effects
	$('#btn_login').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_login").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_login').mouseout(function(){
		$('#menu_selector').hide();
	});

	//create_account mouse effects
	$('#btn_create_account').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_create_account").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_create_account').mouseout(function(){
		$('#menu_selector').hide();
	});

	//logout mouse effects
	$('#btn_logout').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_logout").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_logout').mouseout(function(){
		$('#menu_selector').hide();
	});

	//add_restaurant mouse effects
	$('#btn_add_restaurant').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_add_restaurant").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_add_restaurant').mouseout(function(){
		$('#menu_selector').hide();
	});

	//view_custom_list mouse effects
	$('#btn_view_custom_list').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_view_custom_list").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_view_custom_list').mouseout(function(){
		$('#menu_selector').hide();
	});

	//view_recommendations mouse effects
	$('#btn_recommendations').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_recommendations").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_recommendations').mouseout(function(){
		$('#menu_selector').hide();
	});

	//view_browse_restaurants mouse effects
	$('#btn_browse_restaurants').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_browse_restaurants").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_browse_restaurants').mouseout(function(){
		$('#menu_selector').hide();
	});

	//view_change_style mouse effects
	$('#btn_change_style').mouseover(function(){
		$('#menu_selector').css('top', $("#buttons").position().top+$("#btn_change_style").position().top+2);
		$('#menu_selector').show();
	});
	$('#btn_change_style').mouseout(function(){
		$('#menu_selector').hide();
	});
		
	$('#btn_login').click(function(){
		if(login_dialog == false){
			
			$.ajax({
	           url: "<?php echo site_url('account/login_page');?>",
			   type: 'POST',
	           
	           success: function (msg) {
		           
	        	 	//view the new page
	       			var my_window = add_window(400,210,"Login");
					$(my_window).append(msg);
					login_dialog = true;
	           }
	         });
		}
		return false;
	});

	$('#btn_logout').click(function(){
		$.ajax({
           url: "<?php echo site_url('account/logout');?>",
		   type: 'POST',
           
           success: function (msg) {
				$('#btn_logout').empty();
				$('#username_menu_display').empty();
				//$('#btn_view_custom_list').empty();
				$('#btn_add_restaurant').empty();
				
				$('#btn_sent_tips').empty();
				$('#btn_recommendations').empty();
				
				$('#btn_login').append('Login');
		   		$('#btn_create_account').append('Create a new account');
		   		//setTimeout("check_login()", 3000);

	           	document.getElementById('css1').href = '<?php echo base_url();?>application/views/css/main.css';
				switch_bg('orange.jpg');
           }
         });
		
		return false;
	});
	
	
	$('#btn_create_account').click(function(){
		if(create_account_dialog == false){
			$.ajax({
	           url: "<?php echo site_url('account/create_account_page');?>",
			   type: 'POST',
	           
	           success: function (msg) {
	        	 	//view the new page
	       			var my_window = add_window(644,207,"Create Account");
					$(my_window).append(msg);
					create_account_dialog = true;
	           }
	         });
		}
		return false;
	});
	var counter = 1;

	
	$('#btn_add_restaurant').click(function(){
		if(add_restaurant_dialog == false){
			$.ajax({
				url: '<?php echo site_url("restaurant/add");?>',
				type: 'POST',
	
				success: function(msg) {
					var my_window = add_window(500,500,"Add Restaurant");
					$(my_window).append(msg);
					add_restaurant_dialog = true;
				}
			});
		}
		return false;
	});

	$('#btn_browse_restaurants').click(function(){
		if(browse_restaurants_dialog == false){
			$.ajax({
				url: '<?php echo site_url("restaurant/browse");?>',
				type: 'POST',

				success: function(msg){
					var my_window = add_window(600, 800, 'Browse Restaurants');
					$(my_window).css("top", "-50");
					$(my_window).append(msg);
					browse_restaurants_dialog = true;
				}
			});
		}
		return false;
	});

	
    $("#addButton").click(function () {
     	var my_window = add_window(400,200);
     	$(my_window).append('<br> Hello, what goen on?');
     	$(my_window).append('<br> NICE!!!!!!!!!!!!!!!!!');
     	$(my_window).append('<div class="lol">Close</div>');

    	return false;
    });

    $('#btn_view_custom_list').click(function(){
		$.ajax({
           url: "<?php echo site_url('account/view_custom_list');?>",
		   type: 'POST',
           
           success: function (msg) {
        	 	//view the new page
       			var my_window = add_window(700,210,"My Restaurants");
				$(my_window).append(msg);
           }
         });
		return false;
	});

    $('#btn_map_test').click(function(){
    	var my_window = add_window(500,500,"Google Map");
    	initialize_google_map(50,20,$(my_window));
        
		return false;
	});

    $('#btn_flickr_test').click(function(){
    	var my_window = add_window(850,500,"Restaurant Pictures");
    	initialize_flickr(my_window);
        
		return false;
	});

    $('#btn_flickr_test2').click(function(){
    	var my_window = add_window(850,500,"Restaurant Pictures");
    	get_flickr_images(my_window);
        
		return false;
	});

    $('#btn_flickr_test3').click(function(){
    	var my_window = add_window(500,500,"Restaurant Pictures");
    	$(my_window).append("<div id='temp_text'>Loading Images...</div>");
    	var form_data = {
    			x: 55,
    			y: -3,
    			size: 0.5
    		};
		
		$.ajax({
	           url: "<?php echo site_url('flickr/get_images');?>",
			   type: 'POST',
			   data: form_data,
	           
	           success: function (msg) {
	        	   $("#temp_text").remove();
	        	 	//view the new page
	        	 	var newDiv = $(document.createElement('div'))
					.attr("id","flickr_images");
				
					//add some style to the div
					$(newDiv).css('background-color', '#223');
					$(newDiv).css('width', 490);
					$(newDiv).css('height', 470);
					$(newDiv).css('position', 'absolute');
					$(newDiv).css('left', 5);
					$(newDiv).css('top', 25);
				
					//append it to the _div
					newDiv.appendTo(my_window);
	       			
					$(newDiv).append(msg);
					
	           }
	         });
			return false;
	});

    $('#btn_change_style').click(function(){
		$.ajax({
           url: "<?php echo site_url('account/get_style_page');?>",
		   type: 'POST',
		   dataType: 'json',
           
           success: function (msg) {
        	 	//view the new page
       			var my_window = add_window(320,240,"Change the current style of the page");
				$(my_window).append(msg.javascript);
				$(my_window).append(msg.page);
           }
         });
		
		return false;
	});

    $('#btn_recommendations').click(function(){
		$.ajax({
           url: "<?php echo site_url('account/get_my_recommendations');?>",
		   type: 'POST',
		   //dataType: 'json',
		   //data: {restaurant_name: "Power Resturangen"},
           
           success: function (msg) {
        	 	//view the new page
       			var my_window = add_window(500,520,"Recommendation Inbox");
				//$(my_window).append(msg.javascript);
				
				if(msg.length > 0){
					var arr = msg.split(",+,");
					var arr_length = arr.length;
					$(my_window).append("<b>Number of messages in inbox</b>: "+arr_length/3+"<br/>");
					if(arr_length > 18){
						arr_length = 18;
					}
					for (var i=0;i<arr_length;i+=3)
					{
						$(my_window).append("<b>From</b>: "+arr[i]+"<br/>");
						$(my_window).append("<b>Message</b>: <i>"+arr[i+2]+"</i><br/>");
						$(my_window).append("<b>Restaurant</b>: "+arr[i+1]+"<br/>");
						$(my_window).append("---");
						$(my_window).append("<br/>");
					}
				}
				else{
					$(my_window).append("Your recommendation inbox is empty.");
				}
           }
         });
		
		return false;
	});

});

</script>